<!DOCTYPE html>
<html>

<head>
	<meta charset="utf-8" />
	<title>沙立方</title>
	<meta name="description" content="">
	<meta name="keywords" content="">
	<meta name="renderer" content="webkit">
	<!-- 设置缩放 -->
	<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no, minimal-ui" />
	<!-- 可隐藏地址栏，仅针对IOS的Safari（注：IOS7.0版本以后，safari上已看不到效果） -->
	<meta name="apple-mobile-web-app-capable" content="yes" />
	<!-- 仅针对IOS的Safari顶端状态条的样式（可选default/black/black-translucent ） -->
	<meta name="apple-mobile-web-app-status-bar-style" content="black" />
	<!-- IOS中禁用将数字识别为电话号码/忽略Android平台中对邮箱地址的识别 -->
	<meta name="format-detection" content="telephone=no, email=no" />
	<!-- 启用360浏览器的极速模式(webkit) -->
	<meta name="renderer" content="webkit">
	<!-- 避免IE使用兼容模式 -->
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<!-- 针对手持设备优化，主要是针对一些老的不识别viewport的浏览器，比如黑莓 -->
	<meta name="HandheldFriendly" content="true">
	<!-- 微软的老式浏览器 -->
	<meta name="MobileOptimized" content="320">
	<!-- uc强制竖屏 -->
	<meta name="screen-orientation" content="portrait">
	<!-- QQ强制竖屏 -->
	<meta name="x5-orientation" content="portrait">
	<!-- UC强制全屏 -->
	<meta name="full-screen" content="yes">
	<!-- QQ强制全屏 -->
	<meta name="x5-fullscreen" content="true">
	<!-- UC应用模式 -->
	<meta name="browsermode" content="application">
	<!-- QQ应用模式 -->
	<meta name="x5-page-mode" content="app">
	<!-- windows phone 点击无高光 -->
	<meta name="msapplication-tap-highlight" content="no">
	<meta http-equiv="Cache-Control" content="no-siteapp" />
	<link rel="icon" type="image/png" href="../assets/i/favicon.png">
	<link rel="stylesheet" href="../assets/css/amazeui.css" />
	<!--
		<link rel="stylesheet" href="../assets/font_599973/iconfont.css"/>-->
	<link rel="stylesheet" href="../assets/css/app.css">
	<link rel="stylesheet" href="../assets/css/yttApp.css">
</head>

<body class="bg-F5F6FA">
	<header data-am-widget="header" class="am-header bg-white am-header-fixed">
		<div class="am-header-left am-header-nav text-black padding-left05" id="goBackDivs">
			<a href="javascript:history.go(-1)" class="text-black" id="goBackIcon">
				<i class="am-align-left am-margin-0 am-icon-angle-left am-icon-md text-black"></i>
			</a>
		</div>
		<h1 class="am-header-title teblack">
			<a href="#title-link">最近预约</a>
		</h1>
	</header>
	<div class="am-container nowSup">
		<!--最近预约-->
		<div class="bg-fff am-margin-top-sm radius4 am-padding-sm zjyy_div">
			<div class="am-block over-hide text-258FF3">
				<span class="am-inline-block am-align-left am-margin-0 clock bg-zjyy_div">
					<i class="am-icon-clock-o  text-fff"></i>
				</span>
				<b class="font14 am-inline-block am-align-left am-margin-0 am-padding-left-xs">最近预约</b>
				<div class="moreSup">
				  <a href="courseOrder.html" style="color:#ababab">体验预约>></a>
				</div>
			</div>
			<ul id="course" class="am-avg-sm-1 zjyy_div_ul">
				<!-- <li class="dis-flex am-padding-top-sm am-padding-bottom-sm">
						<div class="w35">
							<div class="img_div radius2 over-hide"><img src="../img/hdxfd.png" /></div>
							<button class="am-btn am-btn-sm am-btn-success radius20 am-margin-top-sm am-btn-block">已成功预约</button>
						</div>
						<div class="am-margin-left-xs  w65 flex1">
							<ul class="w100b am-avg-sm-1 kcxx">
								<li class="dis-flex"><span class="tilte w100b flex">水彩画基础课</span></li>
								<li>入门后水彩画，系统全面的水彩画教程入门后水彩画，系统全面的水彩画</li>
								<li>上课地点：奥利斯校区1024室</li>
								<li>上课时间：2018-03-24 00:00:00</li>
								<li><span class="am-align-left am-margin-0">距离开课：</span>
									<div class="yomibox" data="2018-03-24 00:00:00"></div>
								</li>
							</ul>
						</div>
					</li>
					<li class="dis-flex am-padding-top-sm am-padding-bottom-sm">
						<div class="w35">
							<div class="img_div radius2 over-hide"><img src="../img/hdxfd.png" /></div>
							<button class="am-btn am-btn-sm am-btn-bespeak radius20 am-margin-top-sm am-btn-block posi-rela">立即预约<i class="yuiyd"></i></button>
						</div>
						<div class="am-margin-left-xs w65 flex1">
							<ul class="w100b am-avg-sm-1 kcxx">
								<li class="dis-flex"><span class="tilte w100b flex">水彩画基础课</span><span class="text-FF2A2A am-text-right font14 am-align-right am-margin-0">余位：5位</span></li>
								<li>入门后水彩画，系统全面的水彩画教程</li>
								<li>上课地点：奥利斯校区1024室</li>
								<li>上课时间：2018-03-28:03 09:30-12:00</li>
								<li><span class="am-align-left am-margin-0">距离开课：</span>
									<div class="yomibox" data="2018-03-28 00:00:00"></div>
								</li>
							</ul>
						</div>
					</li> -->
			</ul>
		</div>
		<!--底部菜单-->
		<div data-am-widget="navbar" class="am-navbar am-cf bg-fff" id="mendb">
			<ul class="am-navbar-nav am-cf am-avg-sm-4">
				<li class="active">
					<a href="courseOrder.html">
						<img src="../img/yuyue1.png">
						<span class="am-navbar-label">预约</span>
					</a>
				</li>
				<li>
					<a href="shopp.html">
						<img src="../img/shangcheng2.png">
						<span class="am-navbar-label">商城</span>
					</a>
				</li>
				<li >
					<a href="index.html">
						<img src="../img/zhuye2.png" style="height:35px;width:35px;margin-top:10px;">
					</a>
				</li>
				<li>
					<a href="find.html">
						<img src="../img/faxian2.png">
						<span class="am-navbar-label">发现</span>
					</a>
				</li>
				<li>
					<a href="personal/index.html">
						<img src="../img/wode2.png">
						<span class="am-navbar-label">我的</span>
					</a>
				</li>
			</ul>
		</div>
	</div>
	
	<div class="am-modal am-modal-loading am-modal-no-btn radius4" tabindex="-1" id="my-modal-loading" data-am-modal="{target: '#my-modal-loading'}">
		  <div class="am-modal-dialog" style="border-radius: 4px;">
		    	<div class="am-modal-hd">加载中...</div>
			    <div class="am-modal-bd">
			      <span class="am-icon-spinner am-icon-spin"></span>
			    </div>
		  </div>
		</div>
		
		<div class="am-modal am-modal-alert" tabindex="-1" id="alert1">
		  <div class="am-modal-dialog" style="border-radius: 4px;">
		    	<div class="am-modal-hd"></div>
			   	<div class="am-modal-bd alert1"></div>
		   		<div class="am-modal-footer">
		      		<span class="am-modal-btn">确定</span>
		    	</div>
	  		</div>
		</div>
	<script src="../assets/js/jquery.min.js"></script>
	<script src="../assets/js/jquery.cookie.js"></script>
	<script src="../assets/js/amazeui.min.js"></script>
	<script src="../assets/js/fastclick.min.js"></script>
	<script src="../assets/js/jquery.yomi.js"></script>
	<script src="../js/comm.js"></script>
	<script src="../js/slf.js"></script>
	<script>
		$(function () {
			var courseState = { "1": "已成功预约", "2": "立即预约" };
			loadCourse();
			function loadCourse() {
				slf.ajax({
					url: "/course/getSyllabusListBySchool",
					param: {
						pageIndex: 1,
						pageSize: 20,
					},
					success: function (data) {
						console.log(data, "data")
						console.log(data.obj)
						console.log(data.obj.data)

						if (data.obj) {
							var course = data.obj;
							var html = "";
							if (data.obj.data.length <= 0) {
								html += '<img src="../img/zwsj.png" alt="img" style="width:100%;border-top:1px solid steelblue">';
							}
							for (var i = 0; i < course.length; i++) {
								html += "<li class='dis-flex am-padding-top-sm am-padding-bottom-sm'>";
								html += "<div class='w35'>";
								html += "<div class='img_div radius2 over-hide' onclick='javascript:window.location.href=''basepkg_details.html'><img src='../img/hdxfd.png' /></div>";
								html += "<button class='am-btn am-btn-sm am-btn-success radius20 am-margin-top-sm am-btn-block'>" + courseState[course[i].state] + "</button>";
								html += "</div>";
								html += "<div class='am-margin-left-xs  w65 flex1' onclick='javascript:window.location.href=''basepkg_details.html'>";
								html += "<ul class='w100b am-avg-sm-1 kcxx'>";
								html += "<li class='dis-flex'><span class='tilte w100b flex'>" + course[i].courseName + "</span>";
								if (course[i].state == 2) {
									html += "<span class='text-FF2A2A am-text-right font14 am-align-right am-margin-0'>余位：" + course[i].vacancy + "位</span>";
								}
								html += "</li>";
								html += "<li>" + course[i].description + "</li>";
								html += "<li>上课地点：" + course[i].place + "</li>";
								html += "<li>上课时间：" + course[i].startDate + "</li>";
								html += "<li><span class='am-align-left am-margin-0'>距离开课：</span>";
								html += "<div class='yomibox' data='" + course[i].startDate + "'></div>";
								html += "</li>";
								html += "</ul>";
								html += "</div>";
								html += "</li>";
							}
							$("#course").append(html);
						}
					}
				});
			}
		});
	</script>
</body>

</html>